<template>
	<view class="shop-list-wrap page-bg">
		<view class="shop-shop">
			<image class="shop-shop__icon" :src="info.shopLogo" mode=""></image>
			<view class="shop-shop__info">
				<text class="shop-shop__title">{{info.shopName}}</text>
				<text class="shop-shop__desc desc">{{common.stringPartOf(common.htmlToText(info.shopIntroduce), 18)}}</text>
			</view>
		</view>
		<view class="shop-desc">
			<view class="shop-desc__title">品牌简介</view>
			<view class="shop-desc__con">
				{{info.shopIntroduce}}
			</view>
			
		</view>
		<view class="shop-desc">
			<view class="shop-desc__title">经营范围</view>
			<view class="shop-desc__con">
				{{info.businessScope}}
			</view>
		</view>
		
		<view class="page-submit" v-if="userInfo.isHaveShop">
			<view class="btn-index" @click="link('/pages/shop/shopIn?id='+userInfo.shopId)">店铺信息修改</view>
			<view class="btn-index" @click="link('/pages/shop/shopAuth?id='+userInfo.shopId)">企业店铺认证</view>
		</view>
		
		<view class="footer-block"></view>
	</view>
</template>

<script>
	import common from '../../utils/common.js'
	import { api } from '../../utils/api.js'
	export default{
		data() {
			return{
				nodes: '传播中华传统文化的神圣使命。',
				userInfo: {},
				info: {},
				common,
				text: '滑块视图容器。一般用于左右滑动或上下滑动，比如banner轮播图，注意是滑动切换而不是滚动。swiper下的每个swiper-item是一个滑动切换区域，不能停留在2个滑动区域之间。滑块视图容器。一般用于左右滑动或上下滑动，比如banner轮播图，注意是滑动切换而不是滚动。swiper下的每个swiper-item是一个滑动切换区域，不能停留在2个滑动区域之间。',
				shopId: ''
			}
		},
		
		onLoad(options) {
			this.userInfo = common.getUserInfo()
			this.shopId = options.id || userInfo.shopId
			this.getInfo()
		},
		
		methods:{
			getInfo() {
				api.GetShopById({ id: this.shopId },(res) => {
					 this.info = res || {}
				}) 
			},
			
			link(url) {
				this.$link(url)
			}
		}
	}
</script>

<style scoped lang="less">
	@import url('../../app.less');
	.page-submit{
		    display: flex;
			.btn-index{
				width: 50%;
				border-right: 1px solid @f;
			}
			.btn-index:last-child{
				border-right: none;
			}
	}
	
	.shop-list-wrap{
		padding: 20rpx 30rpx;
		box-sizing: border-box;
	}
	
	.shop-shop{
		.shop-shop__icon{
			width: 90rpx;
			height: 90rpx;
		}
		.shop-shop__title{
			.f28;
			.fw;
		}
		.shop-shop__view{
			background-color: none;
			border: none;
			color: @font-dark-color;
		}
	}
	
	.shop-desc{
		margin-top: 20rpx;
		.br;
		background-color: @f;
		.content-30;
	}
	.shop-desc__title{
		.f32;
		.fw;
		margin-bottom: 20rpx;
	}
	.shop-desc__con{
		.f24;
		color: #666;
		line-height: 35rpx;
		text-align: justify;
	}
</style>
